import React, { Component } from 'react'

import './css/index.css'

export default class App extends Component {
  state = {
    text: '11',
  }
  constructor() {
    super()
    console.log('constructor')
  }

  render() {
    return (
      <div>
        <h1>App</h1>
        {this.state.text}
        <button onClick={() => this.setState({ text: '22' })}>click</button>
      </div>
    )
  }

  // 替代 componentWillUpdate
  getSnapshotBeforeUpdate = (prevProps, prevState) => {
    console.log('getSnapshotBeforeUpdate', prevProps, prevState)
    return {
      a: 1,
    }
  }

  componentDidUpdate(prevProps, prevState, snapshot) {
    console.log('componentDidUpdate', prevProps, prevState, snapshot)
  }

  componentDidMount() {
    console.log('componentDidMount')
  }
}
